import QtQuick 2.12


Rectangle {
    color: "transparent"
    property var zhulanNum: 1
    property var weight: 0
    property var feedCountToday: 0
    property string feedState: "no"

    property string indColor: "darkgray"
    property bool m_bShowInd: true
    property string zhulanId: ""

    signal sigZhulanClicked(string zhulanId, string weight)

    width: 180
    height: 200

    Component.onCompleted: setState(feedState)

    Timer {
        id: timerSpark
        interval: 400
        onTriggered: {
            if (indColor === "darkgray") {
                indColor = "yellow"
            } else {
                indColor = "darkgray"
            }
        }
        repeat: true
        running: feedState==="feeding"
    }

    Timer {
        id: timerHide
        interval: 2000
        repeat: false
        onTriggered: sliderWeight.opacity = 0
    }

    Rectangle {
        id: indicator
        width: 60
        height: 20
        border.width: 2
        visible: m_bShowInd
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.top: parent.top
        anchors.topMargin: 20

//        Behavior on color { PropertyAnimation { duration: 250 } }
//        color: indColor
//        color: feedState === "fed" ? "yellow" : (feedState==="notfed"?"darkgray":"white")
        color: indColor
    }

    Rectangle {
        id: cont
        border.width: 5
        radius: 20
        width: 180
        height: 180

        anchors.horizontalCenter: parent.horizontalCenter
        anchors.top: indicator.bottom
        anchors.topMargin: 10

        Text {
            id: txtLan
            text: "#"+zhulanNum+ " 栏"
            font.pixelSize: 18
            font.bold: true
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.top: parent.top
            anchors.topMargin: 10
        }

        Text {
            id: txtJin
            text: weight+" 斤"
            font.bold: true
            font.pixelSize: 26

            anchors.centerIn: parent
        }

        MouseArea {
            anchors.fill: parent
            enabled: !m_bShowInd
            onClicked: {
                paScale.start()
                sliderWeight.setValue(weight)
                sliderWeight.opacity = 1.0
                timerHide.restart()
            }
        }
    }

    ValueSlider {
        id: sliderWeight
        anchors.top: cont.top
        anchors.topMargin: 70
        anchors.horizontalCenter: cont.horizontalCenter
        width: 100
        height: 150
        hx: 150
        visible: opacity !== 0
        opacity: 0
        minVal: 10
        maxVal: 100
        angle: -90

        Behavior on opacity { PropertyAnimation { duration: 150}}

        onSigValue: {
            weight = v
            timerHide.restart()
            emit: sigZhulanClicked(zhulanId, weight+"")
        }
    }


    PropertyAnimation {
        id: paScale
        target: cont
        property: "scale"
        from: 0.8
        to: 1
        duration: 200
    }

    function setState(st) {
        if (st === "fed") {
            timerSpark.stop()
            indColor = "yellow"
        } else if (st === "feeding") {
            print("feeding")
            timerSpark.start()
        } else {
            timerSpark.stop()
            indColor = "darkgray"
        }
    }
}
